<template>
    <div>
        <ul class="nav">
            <li v-for="(item,index) of cities" :key="index" @click="handleClick">{{index}}</li>
        </ul>
    </div>
</template>
<script>
export default {
    name:"CityWord",
    props:['cities'],
    methods:{
        handleClick(event){
           this.$store.commit("chengLetter",event.target.innerText)
        }
    }
}
</script>
<style lang="scss" scoped>
.nav{
    position: fixed;
    width:50px;
    right:0;
    top:200px;
    color: #00bcd4;
    li{
        text-align: center;
        line-height: 50px;
    }
}
</style>

